<!-- 本页数据在144行 -->
<template>
    <div>
        <el-page-header content="简历中心" icon="" title="就业管理系统" />

        <el-row :gutter="20" class="el-row">
            <el-col :span="6">
                <el-card class="box-card">
                    <el-button type="primary" @click="handleCreateCv">新增简历</el-button>
                    <div v-for="item in state.Cvs">
                        <div class="mb-4">
                            <el-button :key="item.title" type='' @click="clickCv(item.id)">
                                {{ item.title }}
                            </el-button>
                        </div>
                    </div>

                </el-card>
            </el-col>
            <el-col :span="18">
                <el-card>
                    <template #header>
                        <div class="card-header">
                            <span>编辑简历</span>
                        </div>
                    </template>

                    <el-form ref="userFormRef" :model="userForm" :rules="userFormRules" label-width="120px"
                        class="demo-ruleForm">
                        <el-form-item label="标题" prop="title">
                            <el-input v-model="state.userForm.title" />
                        </el-form-item>
                        <el-form-item label="求职意向" prop="job_prefer">
                            <el-input v-model="state.userForm.job_prefer" type="textarea" />
                        </el-form-item>
                        <el-form-item label="培训经历" prop="education_exp">
                            <el-input v-model="state.userForm.education_exp" type="textarea" />
                        </el-form-item>
                        <el-form-item label="项目经历" prop="project_exp">
                            <el-input v-model="state.userForm.project_exp" type="textarea" />
                        </el-form-item>
                        <el-form-item label="实习经历" prop="internship">
                            <el-input v-model="state.userForm.internship" type="textarea" />
                        </el-form-item>
                        <el-form-item label="获奖经历" prop="price">
                            <el-input v-model="state.userForm.price" type="textarea" />
                        </el-form-item>
                        <el-form-item label="其他优势" prop="other_advantage">
                            <el-input v-model="state.userForm.other_advantage" type="textarea" />
                        </el-form-item>

                        <el-form-item label="简历" prop="cv">
                            <!-- <Upload :cv="state.userForm.cv" @kerwinchange="handleChange" /> -->
                            <el-upload class="upload-demo" drag
                                action="/api/picture/upload" limit="1"
                                accept=".pdf"
                                :on-success="handleUploadAddress">
                                <el-icon class="el-icon--upload"><upload-filled /></el-icon>
                                <div class="el-upload__text">
                                    将文件拖到此处 <em>点击上传</em>
                                </div>
                                <template #tip>
                                    <div class="el-upload__tip">
                                        仅支持上传100MB以下的PDF文件，每次更新简历请再次上传PDF
                                    </div>
                                </template>
                            </el-upload>
                        </el-form-item>

                        <el-form-item>
                            <el-button type="primary" @click="submitForm(state.userForm.id)">提交</el-button>
                        </el-form-item>
                    </el-form>
                </el-card>
            </el-col>
        </el-row>

    </div>
</template>
<script setup>
import { useStore } from "vuex";
import { computed, ref, reactive, onBeforeMount } from "vue";
import { UploadFilled } from '@element-plus/icons-vue'
import axios from 'axios'
import { ElMessage } from "element-plus";
import upload from '@/util/upload'
import Upload from '@/components/upload/Upload'
import router from "@/router";

onBeforeMount(() => {
    getCvs(store.state.userInfo.id)
})


const store = useStore();

const userFormRef = ref();
let state = reactive({
    userForm: {
        id: '',
        title: '',
        job_prefer: '',
        education_exp: '',
        project_exp: '',
        internship: '',
        price: '',
        other_advantage: '',
        cvURL: '',
        author: store.state.userInfo.id
    },
    Cvs: [],
})


const userFormRules = reactive({
    title: [{ required: false, message: "标题", trigger: "blur" }],
    job_prefer: [{ required: false, message: "岗位意向", trigger: "blur" }],
    education_exp: [{ required: false, message: "培训经历", trigger: "blur" }],
    project_exp: [{ required: false, message: "项目经历", trigger: "blur" }],
    internship: [{ required: false, message: "实习经历", trigger: "blur" }],
    price: [{ required: false, message: "获奖经历", trigger: "blur" }],
    other_advantage: [{ required: false, message: "讲讲你的优点", trigger: "blur" }],
    cv: [{ required: false, message: "请上传简图片", trigger: "blur" }]
});


const handleUploadAddress=(URL)=>{
    state.userForm.cvURL = URL
    console.log(URL)
}

const handleCreateCv=()=>{
    state.userForm.id=""
    state.userForm.title=""
    state.userForm.job_prefer=""
    state.userForm.education_exp=""
    state.userForm.project_exp=""
    state.userForm.internship=""
    state.userForm.price=""
    state.userForm.other_advantage=""
    state.userForm.cvURL=""
}

//更新提交
const submitForm = async(id) => {
    if (id) {//更改简历（有id）
        //向后端发送更新信息
        if(state.userForm.cvURL!==""&&state.userForm.title!==""){//确认已上传简历并获取URL并设置title
            console.log(state.userForm.cvURL)
            const res = await axios.patch("/cv/updateById",state.userForm)
            if (res.data.code === 0) {
                ElMessage.success("简历信息更新成功")
                state.userForm.id=""
                state.userForm.title=""
                state.userForm.job_prefer=""
                state.userForm.education_exp=""
                state.userForm.project_exp=""
                state.userForm.internship=""
                state.userForm.price=""
                state.userForm.other_advantage=""
                state.userForm.cvURL=""
                location.reload();
                ElMessage("请稍候，正在获取简历信息")
            } else {
                ElMessage.error("未知错误更新失败")
            }
        } else {
            ElMessage.error("请先填写标题并上传简历PDF")
        }            
        
    } else {
        //新增简历（无id）
        //向后端发送添加信息
        if(state.userForm.cvURL!=="" && state.userForm.title!==""){
            console.log(state.userForm.cvURL)
            axios.post("/cv/add",state.userForm)
            ElMessage.success("简历创建成功")
            ElMessage("请稍候，正在获取简历信息")
            state.userForm.id=""
            state.userForm.title=""
            state.userForm.job_prefer=""
            state.userForm.education_exp=""
            state.userForm.project_exp=""
            state.userForm.internship=""
            state.userForm.price=""
            state.userForm.other_advantage=""
            state.userForm.cvURL=""
            location.reload();
        } else {
            ElMessage.error("请先填写标题并上传简历PDF")
        }
    }

}   

const getCvs = async (id) => {
    //从后端获取由id查找的该同学的所有简历

    state.Cvs = [
        {
            id: "1",
            title: "cv1",
            job_prefer: 'cv1',
            education_exp: 'cv1',
            project_exp: 'cv1',
            internship: 'cv1',
            price: 'cv1',
            other_advantage: 'cv1',
        },
        {
            id: "2",
            title: "cv2",
            job_prefer: 'cv2',
            education_exp: 'cv2',
            project_exp: 'cv2',
            internship: 'cv2',
            price: 'cv2',
            other_advantage: 'cv2',
        },
        {
            id: "3",
            title: "cv3",
            job_prefer: 'cv3',
            education_exp: 'cv3',
            project_exp: 'cv3',
            internship: 'cv3',
            price: 'cv3',
            other_advantage: 'cv3',
        }
    ]

    const form = await axios.get(`/cv/findByAuthor?author=${store.state.userInfo.id}`)
    state.Cvs = form.data.data

}

const clickCv = (id) => {
    let i = 0;
    for (i = 0; i < state.Cvs.length; i++) {
        if (state.Cvs[i].id == id) break
    }
    state.userForm.id = state.Cvs[i].id
    state.userForm.title = state.Cvs[i].title
    state.userForm.job_prefer = state.Cvs[i].job_prefer
    state.userForm.education_exp = state.Cvs[i].education_exp
    state.userForm.project_exp = state.Cvs[i].project_exp
    state.userForm.internship = state.Cvs[i].internship
    state.userForm.price = state.Cvs[i].price
    state.userForm.other_advantage = state.Cvs[i].other_advantage
    console.log(state.userForm)
}
</script>

<style scoped lang="scss">
.el-row {
    margin-top: 20px;

    .box-card {
        text-align: center;
    }
}

.el-link {
    margin-right: 8px;
}

.el-link .el-icon--right.el-icon {
    vertical-align: text-bottom;
}
</style>
